@import "../../wxss/base/_base";
@import "../../wxss/global.scss";
@import "../../wxss/mod/icofont.scss";

page{background: #f5f5f5;}

.dialog-wrap{padding-bottom: 150rpx;}
.dialog-item{position: relative;
	.pic{width: 72rpx;height: 72rpx;border: 1px solid #e5e5e5;border-radius: 15rpx;background: #fff;position: absolute;top: 36rpx;}
	.dialog{display: inline-block;border-radius: 10rpx;line-height: 1.4;padding: 28rpx 20rpx;position: relative;color: #353535;font-size: 28rpx;
		&::after{content: "";}
		.link{color: #156ae9;}
	}
	&.other{padding: 36rpx 98rpx 24rpx 130rpx;
		.pic{right: 16rpx;}
		.dialog{background: #edd9b8;margin-right: 18rpx;
			&::after{@include triangle-right($size:12rpx,$color:#edd9b8);top:30rpx;-webkit-transform:translateY(0)}
		}
		
	}
	&.me{padding: 36rpx 130rpx 24rpx 98rpx;
		.pic{left: 16rpx;}
		.dialog{background: #fff;margin-left: 18rpx;
			&::after{@include triangle-left($size:12rpx,$color:#fff);top:30rpx;-webkit-transform:translateY(0)}
		}
		
	}
}

.dialog-time{text-align: center;margin-bottom: -16rpx;padding-top: 36rpx;
	.txt{font-size: 24rpx;color: #fff;background: #ccc;line-height: 40rpx;text-align: center;padding: 0 26rpx;border-radius: 3rem;}
}

.fixed-btn-area{min-height: 132rpx;background: #fff;position: fixed;left: 0;right: 0;bottom: 0;@include flex-box;@include vc;
	.lt{padding: 15rpx 36rpx;
		.tt{font-size: 30rpx;color: #353535;}
		.sub-txt{font-size: 24rpx;color: #888;padding-top: 14rpx;}
	}
}

.btn-b{min-width: 254rpx;height: 132rpx;line-height: 132rpx; text-align: center;background: #bfb197;color: #fff;font-size: 24rpx;
	.eps{font-size: 40rpx;}
}


.ico-tool{font-size: 52rpx;display: inline-block;color: #7f838c;
	& + .ico-tool{margin-left: 18rpx;}
}
.communicate-tool{background: #fff;position: fixed;left: 0;right: 0;bottom: 0;@include flex-box;@include vc;padding: 14rpx 18rpx;
	.lt{}
	.md{@include flex;padding: 0 18rpx;}
	.rt{}
	.ipt-wrap{border: 1px solid #d9d9d9;border-radius: 10rpx;
		input{font-size: 28rpx;color: #353535;line-height: 32rpx;padding: 15rpx 10rpx;width: 100%;-webkit-box-sizing:border-box;box-sizing:border-box;}
	}
}